<template>
  <el-dialog
    :title="dialogTitle"
    :visible="dialogVisible"
    @close="dialogCancle"
    :close-on-click-modal="false"
    width="35vw"
    :modal-append-to-body="false"
    :append-to-body="true"
    top="25vh"
    v-dialogDrag
  >
    <el-form
      ref="userInfo"
      size="small"
      :model="userInfo"
      :rules="rules"
      label-width="100px"
      class="sys-dialog-style"
    >
      <el-form-item prop="loginPhone" label="手机号：">
        <el-input
          type="number"
          v-model="userInfo.loginPhone"
          placeholder="输入手机号(登录账号)"
          :maxlength="11"
          class="user-dialog-input"
        ></el-input>
      </el-form-item>
      <el-form-item prop="fullName" label="姓名：">
        <el-input
          type="text"
          v-model="userInfo.fullName"
          placeholder="输入姓名"
          maxlength="24"
          class="user-dialog-input"
        ></el-input>
      </el-form-item>
      
      <el-form-item prop="needFlush" label="审核状态">
        <el-select v-model="userInfo.auditState" placeholder="请选择" class="user-dialog-input">
          <el-option
            v-for="item in auditStates"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogCancle" size="small">取 消</el-button>
      <el-button type="primary" @click="checkedSubmit" size="small" :loading="loadingFlg">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>

  import { getUserRecordById, addUserType } from '@/api/funeralparlour/funeralparlour.js'

  export default {
    name: "userRecordEditDialog",
    props: {
      dialogVisible: {
        type: Boolean,
        default: false
      },
      room: {
        type: Object,
        default: {}
      }
    },

    watch: {
      dialogVisible() {
        this.visible = this.dialogVisible;

        if (!this.visible)
          return;

        var postData = {
          "id": this.room.id
        }
        getUserRecordById(postData).then(res => {
          this.userInfo = res.data;
        });
      }
    },
    data() {
      

      return {
        //是否加载
        auditStates: [
          { value: 0, label: '未审核'},
          { value: 1, label: '已通过'},
          { value: 2, label: '未通过'}
        ],
        loadingFlg: false,
        visible: false,
        parksOptions: [],
        userInfo: {},
        rules: {
          loginPhone: [
          {
            required: true,
            message: '请输入手机号',
            trigger: 'blur'
          },
          {
            pattern: /^1[3|4|5|7|8][0-9]\d{8}$/,
            message: '手机号格式不对',
            trigger: 'blur'
          },
        ],
        fullName: [
          {
            required: true,
            message: '请输入姓名',
            trigger: 'blur'
          },
          {min: 2, max: 10, message: '长度在 2 到 10 个字符', trigger: 'blur'}
        ]
        }
      };
    },
    computed: {
      dialogTitle() {
        return "编辑app用户";
      }
    },
    methods: {
      //提交Point信息
      checkedSubmit() {
        this.$refs.userInfo.validate(valid => {
          if (valid) {
            let message = "确认编辑用户吗？";

            this.$confirm(message, "提示", {})
              .then(() => {
                this.loadingFlg = true;
                // 添加类型
                let params = this.userInfo;
                params.gmtCreate = "";
                params.gmtModified = "";
                addUserType(params)
                  //console.log(params)
                  .then(res => {
                    this.loadingFlg = false;
                    this.$message({
                      message: res.message,
                      type: "success"
                    });
                    this.dialogCancle();
                    this.$emit("renovate");
                  })
                  .catch(res => {
                    this.loadingFlg = false;
                  });
              })
              .catch(() => {});
          }
        });
      },
      //关闭弹窗
      dialogCancle() {
        this.visible = false;
        this.$refs.userInfo.resetFields();
        this.$emit("dialogCancle", this.visible);
      },
    }
  };
</script>
